<template>
	<view>
		<u-navbar :is-back="false" title="我的" :background="{backgroundColor:'#E62131'}"
			title-color="#ffffff"></u-navbar>
		<view class="toplistad fliexs">
			<view class="topheader fliexs" @click="tomedetss" v-if="userInfo">
				<u-image width="90rpx" height="90rpx" v-if="userInfo.studentInfo.headImg"
					:src="userInfo.studentInfo.headImg" shape="circle"></u-image>
				<u-image width="90rpx" height="90rpx" v-else src="@/static/images/applogo.png" shape="circle"></u-image>
				<div class="names">
					<view class="" v-if="userInfo">
						{{userInfo.studentInfo.name}}/<text
							v-if="userInfo.classInfo">{{userInfo.classInfo.classInfo.name}}</text><text>编辑</text>
					</view>
					<view class="">
						<u-icon name="map" size="28" color="#ffffff"></u-icon> <span
							style="padding-left: 10rpx;font-size: 28rpx;">{{userInfo.studentInfo.campusName}}</span>
					</view>
					<span class="paosits"><u-icon name="edit-pen-fill" size="28" color="#ffffff"></u-icon></span>
				</div>
			</view>
		</view>
		<view class="centerss" v-if="userInfo">
			<view class="all_cards cardlist fles">
				<view class="lcistafd">
					<u-icon name="account-fill" size="28" color="#E62131"></u-icon> <span
						style="padding-left: 10rpx;font-size: 30rpx;font-weight: bold;">家庭成员</span>
				</view>
				<view class="clistadf">
					<view class="lsiutgimg">
						<image class="imgadasdffs" v-if="userInfo.studentInfo.headImg"
							:src="userInfo.studentInfo.headImg" mode=""></image>
						<image class="imgadasdffs" v-else src="../../static/images/me.png" mode=""></image>
						<view class="namdasad">
							{{userInfo.studentInfo.name}}
						</view>
					</view>
					<view class="lsiutgimg">
						<image class="imgadasdffs" v-if="userInfo.parentsInfo.headImg"
							:src="userInfo.parentsInfo.headImg" mode=""></image>
						<image class="imgadasdffs" v-else src="../../static/images/me.png" mode=""></image>
						<view class="namdasad">
							{{userInfo.parentsInfo.nickName}}
						</view>
					</view>
				</view>

			</view>
			<view class="all_cards cardlist fles">
				<view class="lcistafd">
					<u-icon name="server-man" size="28" color="#E62131"></u-icon> <span
						style="padding-left: 10rpx;font-size: 30rpx;font-weight: bold;">我的老师</span>
				</view>
				<view class="clistadf">
					<view class="lsiutgimg" v-if="userInfo && userInfo.courseInfo">
						<image class="imgadasdffs" v-if="userInfo.courseInfo.headImg" :src="userInfo.courseInfo.headImg"
							mode=""></image>
						<image class="imgadasdffs" v-else src="../../static/images/me.png" mode=""></image>
						<view class="namdasad">
							{{userInfo.courseInfo.nickName}}
						</view>
					</view>
					<!-- <view class="lsiutgimg">
						<image class="imgadasdffs" src="../../static/images/me.png" mode=""></image>
						<view class="namdasad">
							张三王二
						</view>
					</view> -->
				</view>

			</view>
			<view class="all_cards cardlist fles" style="display: flex;align-items: center;justify-content: space-between;" @click="tosignatereAgrement">
				<view class="lcistafd">
					<u-icon name="coupon-fill" size="28" color="#E62131"></u-icon> <span
						style="padding-left: 10rpx;font-size: 30rpx;font-weight: bold;">我的合约</span>
				</view>
				<u-icon name="arrow-right" size="28" color="#E62131"></u-icon>
				<!-- <view class="clistadf">
					<view class="lsiutgimg">
						<image class="imgadasdffs" v-if="userInfo.courseInfo.headImg" :src="userInfo.courseInfo.headImg"
							mode=""></image>
						<image class="imgadasdffs" v-else src="../../static/images/me.png" mode=""></image>
						<view class="namdasad">
							{{userInfo.courseInfo.nickName}}
						</view>
					</view>
				</view> -->

			</view>
		</view>

		<!-- <view class="tuichusa" @click="outLogn">
			退出登录
		</view> -->
	</view>
</template>

<script>
	import staticUrl from "@/common/config.js"
	export default {
		data() {
			return {
				checked: true,
				action: staticUrl.staticUrl,
				header: {
					accessToken: 'bearer ' + uni.$func.cache("token"),
				},
				userInfo: null,
				src: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
				studentId: "",
			}
		},
		
		onLoad(options) {
			// let userInfo=uni.$func.cache("userInfo");
			// if(userInfo){
			// 	this.userInfo = userInfo;
			// }
		},
		onShow() {
			this.usersgetUserInfoApi()
		},
		onReachBottom() {},
		methods: {
			outLogn() {
				uni.clearStorageSync();
				uni.reLaunch({
					url: '../index/index'
				})
			},
			tosignatereAgrement(){
				uni.navigateTo({
					url: './signatureList'
				})
			},
			usersgetUserInfoApi() {
				uni.$api.common.userscurrent().then((res) => {
					this.studentId = res.result.studentId
					if (this.studentId) {
						uni.$api.common.getStudentInfoById(res.result.studentId).then((res) => {
							this.userInfo = res.result

						});
					}

				});
			},
			tomedetss() {
				uni.navigateTo({
					url: './endinfo?studentId=' + this.studentId
				})
			},

		}
	}
</script>
<style scoped>
	button::after {
		border: 0;
	}

	button {
		background: none !important;
		line-height: normal;
		padding: 0;
		margin: 0;
		color: #ffffff;
		text-align: left;
	}
</style>
<style lang="scss">
	.toplistad {
		height: 200rpx;
		background-color: #E62131;
		padding: 0 40rpx;

		.topheader {
			.images {
				width: 90rpx;
				height: 90rpx;
				border-radius: 50%;
			}

			.names {
				padding-left: 30rpx;
				color: #ffffff;
				font-weight: 600;
				font-size: 38rpx;
				position: relative;

				.paosits {
					position: absolute;
					right: -50rpx;
					top: -10rpx;
				}
			}
		}
	}

	.centerss {
		padding: 30rpx;
	}

	.listads {
		background-color: #ffffff;
		position: relative;
		top: -55rpx;
		left: 0;
		right: 0;
		padding: 20rpx 50rpx;

		.listcenter {
			text-align: center;

			.imgadfs {
				width: 70rpx;
				height: 70rpx;
				margin-bottom: 20rpx;
			}
		}
	}

	.cardlist {
		margin-top: 20rpx;
		margin-bottom: 20rpx;

		.titles {
			font-weight: bold;
			font-size: 30rpx;
			margin-top: 30rpx;
		}

		.textcet {
			padding: 10rpx 0;
		}

		.cityopt {
			display: flex;

			.rightcity {
				.cityname {
					font-size: 34rpx;
				}

				.details {
					font-size: 28rpx;
					color: #D2CCCC;
				}
			}
		}

		.dates {
			color: #707070;
			display: flex;
			align-items: center;
			padding: 0 20rpx 0;
			padding-top: 20rpx;

			.spans {
				padding-left: 5rpx;
			}
		}

		.dalist {
			color: #707070;
			display: flex;
			align-items: center;
			padding: 0 20rpx 0;
			padding-top: 20rpx;

			.testone {
				padding: 0 5px;
			}

			.prices {
				color: #000000;
			}
		}
	}

	.borders {
		width: 100%;
		margin: 30rpx 0;
		height: 1rpx;
		background-color: #D7D7D7;
	}

	.fles {
		position: relative;
		left: 0;
		right: 0;
		top: -20rpx;

		.listscenter {
			border-bottom: 1rpx solid #E9E9E9;
			font-size: 32rpx;
			padding: 20rpx 0;

			.lefts {
				color: #707070;
				display: flex;
				align-items: center;

				.imsc {
					margin-right: 10rpx;
					width: 45rpx;
					height: 45rpx;
				}
			}
		}
	}

	.tuichusa {
		width: 80%;
		height: 80rpx;
		line-height: 80rpx;
		text-align: center;
		border: 1rpx solid #e1e1e1;
		background-color: #E62131;
		border-radius: 50rpx;
		color: #ffffff;
		margin: 100rpx auto 0;
	}

	.clistadf {
		display: flex;
		align-items: center;
		margin-top: 20rpx;

		.lsiutgimg {
			text-align: center;
			margin-right: 30rpx;

			.imgadasdffs {
				width: 50rpx;
				height: 50rpx;
				border-radius: 50%;
			}

			.namdasad {
				margin-top: 10rpx;
				font-size: 28rpx;
			}
		}
	}
</style>